<template>
  <div class="pbox">
    <h1>{{msg}}</h1>
    <Child></Child>
  </div>
</template>

<script lang='ts'>
import {ref,reactive,provide} from 'vue'
import Child from './components/Child.vue';
export default{
    setup() {
        let msg=ref<string>('Helloworld')
        provide('p-key',msg)//在祖先组件的一方通过provoider来提供数据
        return {msg};
    },
    components: { Child }
}
</script>

<style lang='scss' scoped>
  .pbox{
    width: 500px;
    height: 400px;
    background-color: tomato;
  }
</style>